//定义聊天框
Ext.define('chattingBase', {
    extend: 'Ext.panel.Panel',
    scrollable: 'y',
    tools: [{
        type: 'close',
        listeners: [{
            click: function (tool, e, panel, eOpts) {
                if (panel.notReadMessages.length > 0)
                    Ext.Msg.alert("错误", "不能关闭有未读消息的聊天窗口！");
                else
                    panel.destroy();
            }
        }]
    }],
    dockedItems: [{
        xtype: 'toolbar',
        dock: 'bottom',
        itemId: 'dockedItems',
        ui: 'footer',
        items: [
            {
                xtype: 'textfield',
                itemId: 'msgText',
                allowBlank: false,
                maxLength: 10,
                emptyText: '字数限制:10'
            }, {
                xtype: 'button',
                width: 70,
                text: '发送',
                listeners: [{
                    click: function () {
                        var msgText = this.up('panel').down('#msgText').getValue();
                        if (msgText == null || msgText == '')
                            Ext.Msg.alert("错误", "不能发送空消息！");
                        else if (msgText.length > 10)
                            Ext.Msg.alert("错误", "每条消息不能超过10个字！");
                        else {
                            var message = new Object();
                            var msgId = getUuid();
                            message['id'] = msgId;
                            message['sender'] = currentUserId;
                            message['receiver'] = this.up('panel').getItemId();
                            message['message'] = msgText;
                            message['type'] = 0;
                            webSocketSendMessage(webSocket, message);
                            //将消息添加到聊天框
                            this.up('panel').add(Ext.create('rightChatMsgBox',
                                msgId,
                                msgText));
                            this.up('panel').setScrollY(1000000);//将滚动条滑倒最低端
                            this.up('panel').topMsgId = msgId;
                            this.up('panel').down('#msgText').setValue();//将消息框清空
                        }
                    }
                }]
            }, '-', {
                xtype: 'button',
                // width: 70,
                tooltip: '获取历史消息,每次最多获取5条',
                text: '获取历史消息',
                listeners: [{
                    click: function () {
                        var msg = new Object();
                        msg['sender'] = currentUserId;
                        msg['receiver'] = this.up('panel').getItemId();
                        msg['type'] = 2;
                        if (this.up('panel').topMsgId != null)//如果不存在最顶端消息的话
                            msg['id'] = this.up('panel').topMsgId;
                        webSocketSendMessage(webSocket, msg);
                    }
                }]
            }]
    }],
    listeners: [{
        expand: function (panel, eOpts) {//一展开面板就说明消息已读
            for (var i = 0, length = panel.notReadMessages.length; i < length; i++) {
                panel.notReadMessages[i].type = 1;
                webSocketSendMessage(webSocket, panel.notReadMessages[i])//发送消息说这些消息都已经读了
            }
            panel.setTitle(panel.senderName);//将标题栏的新消息显示清空
            chattingTotalNoReadCount = chattingTotalNoReadCount - panel.notReadMessages.length;
            updateChattingTabNoReadCount(chattingTotalNoReadCount);//更新tab的未读数量显示
            panel.notReadMessages = [];//未读数组清空
            panel.setScrollY(1000000);//将滚动条滑倒最低端
        }
    }],
    constructor: function () {
        this.callParent(arguments); // 调用父类的构造函数,不然会报错
        this.itemId = arguments[0];//聊天对象Id(用于获取此聊天框)
        this.setTitle(arguments[1]);//聊天对象昵称
        this.senderName = arguments[1];//储存聊天对象昵称
        this.notReadMessages = new Array();//储存未读消息
    }
});

// //定义聊天框左右两边的消息框
// Ext.define('chatMsgBox', {
//     extend: 'Ext.form.field.Display',
//     constructor: function () {
//         this.callParent(arguments); // 调用父类的构造函数,不然会报错
//         this.pattern = arguments[0];
//         this.fieldCls = arguments[0] == 'left' ? 'chatLeft' : 'chatRight';
//         this.style = arguments[0] == 'left' ? 'float: left;clear:both;' : 'float: right;clear:both;';//不知道为什么cls里面写不起作用，要在这里写才行
//         this.msgId = arguments[1];//消息Id
//         this.setValue(arguments[2]);//消息内容
//     }
// });
//不知道为什么两个定义合在一起就会一直往最上面添加，拆分成两个就不会
//定义聊天框左两边的消息框
Ext.define('leftChatMsgBox', {
    extend: 'Ext.form.field.Display',
    fieldCls: 'chatLeft',
    style: 'float: left;clear:both;',
    constructor: function () {
        this.callParent(arguments); // 调用父类的构造函数,不然会报错
        this.pattern = 'left';
        this.msgId = arguments[0]; //消息Id
        this.setValue(arguments[1]); //消息内容
    }
});

//定义聊天框右两边的消息框
Ext.define('rightChatMsgBox', {
    extend: 'Ext.form.field.Display',
    fieldCls: 'chatRight',
    style: 'float: right;clear:both;',
    constructor: function () {
        this.callParent(arguments); // 调用父类的构造函数,不然会报错
        this.pattern = 'right';
        this.msgId = arguments[0]; //消息Id
        this.setValue(arguments[1]); //消息内容
    }
});
